<template>
  <el-tree :data="menus" :props="defaultProps" @node-click="handleNodeClick"></el-tree>
</template>

<script>
// 这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）

export default {
  name: 'category',
  // import引入的组件需要注入到对象中才能使用
  components: {},

  props: {},

  data () {
    return {
      menus: [],
      defaultProps: {
        children: 'children',
        label: 'name'
      }
    }
  },

  // 计算属性 类似于data概念
  computed: {},

  // 监控data中的数据变化
  watch: {},

  // 方法集合
  methods: {
    getMenus () {
      this.dataListLoading = true
      this.$http({
        url: this.$http.adornUrl('/product/category/list/tree'),
        method: 'get'
      }).then(({data}) => {
        this.menus = data.data
      })
    }
  },

  // 生命周期-创建完成（可以访问当前this实例）
  created () {
    this.getMenus()
  },

  // 生命周期-挂载完成（可以访问DOM元素）
  mounted () {
  },

  // 生命周期-创建之前
  beforeCreate () {
  },

  // 生命周期-挂载之前
  beforeMount () {
  },

// 生命周期-更新之前
  beforeUpdate () {
  },

  // 生命周期-更新之后
  updated () {
  },

  // 生命周期-销毁之前
  beforeDestroy () {
  },

  // 生命周期-销毁完成
  destroyed () {
  },

  // 如果页面有keep-alive缓存功能，这个函数会触发
  activated () {
  }
}
</script>

<style scoped>

</style>
